<!--#
layout("/layouts/platform.html"){
#-->
<header class="header navbar bg-white shadow">
    <div class="btn-group tool-button">
        <a class="btn btn-primary navbar-btn" href="${base}/platform/dec/api" id="goBack" data-pjax><i class="ti-angle-left"></i>${msg['globals.button.back']}</a>
    </div>
</header>

<div class="content-wrap">
    <div class="wrapper" style="min-height:500px;">
        <section class="panel panel-form">
            <form id="addForm" role="form" class="form-horizontal parsley-form" data-parsley-validate
                  action="${base}/platform/dec/api/addDo" method="post">
                <div class="row mb10 mt10">
                    <div class="col-lg-12">
                        <div class="form-group">
                            <label for="interfaceName" class="col-sm-2 control-label">${msg['dec.api.column.interfaceName']}</label>
                            <div class="col-sm-8">
                            <input type="text" id="interfaceName" class="form-control" name="interfaceName" data-parsley-required="true" placeholder="${msg['dec.api.column.interfaceName']}">
                            </div>
                        </div>
                        <div class="form-group" hidden="hidden">
                            <label for="groupUuid" class="col-sm-2 control-label">${msg['dec.api.column.groupUuid']}</label>
                            <div class="col-sm-8">
                            <input type="text" id="groupUuid" class="form-control" name="groupUuid" data-parsley-required="true" placeholder="${msg['dec.api.column.groupUuid']}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="description" class="col-sm-2 control-label">${msg['dec.api.column.description']}</label>
                            <div class="col-sm-8">
                            <input type="text" id="description" class="form-control" name="description" data-parsley-required="true" placeholder="${msg['dec.api.column.description']}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="groupName" class="col-sm-2 control-label">${msg['dec.api.column.groupName']}</label>
                            <div class="col-sm-8">
                                <select id="groupZhName" class="form-control" name="groupZhName">
                                    <!--# for(o in list){
          #-->
                                    <option value="${o.id}">${o.groupZhName}</option>
                                    <!--#
                    }#-->
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label  class="control-label col-sm-2">接口参数</label>

                            <div class="col-sm-6"><button id="trAdd" onclick="javascript:;" title="新增" rel="tooltip" class="btn btn-success btn-sm pull-right"><i class="fa fa-plus"></i> 新增</button></div>

                            <input type="hidden" name="tNumber" value="1">
                            <div class="col-sm-6 col-sm-offset-2">
                                <table class="table">
                                    <thead>
                                    <th width="30%">参数名</th>
                                    <th width="20%">是否必须</th>
                                    <th width="35%">描述</th>
                                    <th width="100px">操作</th>
                                    </thead>
                                    <tbody>
                                    <tr>
                                        <td><input type="text" name="paramName1" class="form-control" data-rule-required="true" data-rule-minlength="2" data-rule-maxlength="15"></td>
                                        <td>
                                            <select name="whetherMust1" class="form-control">
                                                <option value="1">是</option>
                                                <option value="0">否</option>
                                            </select>
                                        </td>
                                        <td><input type="text" name="paramDescribe1" class="form-control" data-rule-required="true" data-rule-minlength="2" data-rule-maxlength="40"></td>
                                        <td><a href="javascript:void(0);" onclick="deleteTr(this)">删除</a></td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="col-lg-3"></div>
                <div class="col-lg-6">
                    <div class="form-group text-center">
                        <label></label>
                        <input  hidden="hidden"  type="text" id="groupName" name="groupName">
                        <div>
                            <button class="btn btn-primary btn-block btn-lg btn-parsley" data-loading-text="${msg['globals.button.submit.tip']}" id="add">${msg['globals.button.submit']}</button>
                        </div>
                    </div>
                </div>
            </form>
        </section>
    </div>
</div>
<script language="JavaScript">
    $(document).ready(function () {
        $('#addForm').ajaxForm({
            dataType: 'json',
            beforeSubmit: function (arr, form, options) {
                form.find("button:submit").button("loading");
            },
            success: function (data, statusText, xhr, form) {
                if (data.code == 0) {
                    Toast.success(data.msg);
                    form.resetForm();
                } else {
                    Toast.error(data.msg);
                }
                form.find("button:submit").button("reset");
            }
        });
    });
    $("#add").click(function(){
        var groupUuid=$("#groupZhName").val();
        $("#groupUuid").val(groupUuid);
        $("#groupName").val($("#groupZhName").find("option:selected").text());
    })
    //动态添加tr
    var trNum = 1;
    $("#trAdd").click(function(event){
        trNum++;
        var newSubTr = '<tr><td><input type="text" name="paramName'+trNum+'" class="form-control" data-rule-required="true" data-rule-minlength="2" data-rule-maxlength="15"></td>'
            + '<td><select name="whetherMust'+trNum+'" class="form-control"><option value="1">是</option><option value="0">否</option></select></td>'
            + '<td><input type="text" name="paramDescribe'+trNum+'" class="form-control" data-rule-required="true" data-rule-minlength="2" data-rule-maxlength="40"/></td>'
            + '<td><a href="javascript:void(0);" onclick="deleteTr(this)">删除</a></td></tr>';
        $("tr:last").after(newSubTr);
        $("input[name='tNumber']").val(trNum);
        event.preventDefault();
    });

    //删除当前行
    function deleteTr(nowTr){
        $(nowTr).closest("tr").remove();
    }
</script>
<!--#}#-->


